<!DOCTYPE html>
<html lang="en">
<head>
    <title id="title">Stall</title>
    <meta charset="utf-8">
    <script src="/static/shared/js/jquery.js"></script>
    <link type="text/css" rel="stylesheet" href="/static/stall/css/stallstyle.css"/>
  <!--  <link type="text/css" rel="stylesheet" href="/static/stall/css/stylesheet.css"/>-->
    <link href="/static/bootstrap/css/signin.css" rel="stylesheet">
    <link type="text/css" rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css"/>
    <script src="/static/bootstrap/js/bootstrap.min.js"></script>
    <script src="/interface/int.js"></script>
    <script src="/static/stall/js/stall.js"></script>

</head>



    
    
    
    <body screen_capture_injected="true">

        
        <div class="container" name="loginForm" id="loginForm" method="post" style="display:none">
            
            <form class="form-signin">
                <h4 align="center"> CaMS Stall </h4>
                <h3 class="form-signin-heading">Please sign in as stall user</h3>
                <input type="text" class="form-control" placeholder="Username" autofocus="" id="username">
                <input type="password" class="form-control" placeholder="Password" id="password">
                          
                <button class="btn btn-info btn-block" type="button" name="loginSubmit" id="loginSubmit">Sign in</button>
                <button class="btn btn-info btn-block" type="reset" name="loginReset" id="loginReset">Clear</button>
            </form>
            
        </div> <!-- /container -->
        
        
        <!-- Bootstrap core JavaScript
         ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
<div id="wrapper">
   
    
    <div id="take-order" style="display:none">
    <div id="menu">
    </div>
    
    <div id="order-cart">
        
        <h3> Order Cart </h3>
        <div id=cart-items></div>
        <h4 id=total-price></h4>
        
        <div class = "form control" id="cart-form">
            <button type="button" id="confirm-order" class="btn btn-info btn-md cart-button">
                <span class="glyphicon glyphicon-ok-sign">Confirm</span>
            </button>
            <button type="button" id="cancel-order" class="btn btn-warning btn-md cart-button">
                <span class="glyphicon glyphicon-trash">Cancel</span>
            </button>
        </div>
    </div>
   
    <!--take-order-templates-->
    <div style="display:none">

        <div id="cart-item-template" class="cart-item">
            <ul class="cart-item-ul">
                <li class="cart-item-name">
                </li>
                <li class="cart-item-price">
                </li>
                <div>
                    <span>
                         <button type="button" class="btn btn-info btn-sm minus">
                            <span class="glyphicon glyphicon-minus"></span>
                        </button>
                        <input class="cart-item-quantity" size="4" maxlength="3">
                        <button type="button" class="btn btn-info btn-sm plus">
                            <span class="glyphicon glyphicon-plus"></span>
                        </button>
                        <input style="width:120px; display:inline" type="text" class="form-control remarks" placeholder="Remarks" /> 
                    </span>
                    
                    
	
                        <button type="button" class="btn btn-warning btn-sm trash">
                            <span class="glyphicon glyphicon-remove"></span>
                        </button>
              
                </div>
            </ul>
            
            <br class="clear-float"/>
        </div>

        <div id="menu-item-template" class="menu-item" style="display:none">
            <div class= "menu-ul">
                <div class="menu-item-name menu-li"></div>
                <div class="menu-item-price menu-li"></div>
            </div>
            
        </div>
    </div><!--end of take-order-templates-->
    </div><!--end div of take-order-->

    
    
    <div id="processing-order" style="display:none">
    </div>
    <!--processing-order-templates-->
    <div style="display:none">
        <div class="processing-order-item" id="processing-order-item-template">
            <div class="processing-order-info">
            <h4 class="q-num"></h4>
            </div>
            <div class="processing-order-details">
            <table class="processing-order table">
            </table>
            </div>
            <div class="processing-order-form">
               <button type="button" class="btn btn-warning btn-md processing-order-revoke-btn">
                    <span class="glyphicon glyphicon-remove"></span>
                </button>
                
                <button type="button" class="btn btn-info btn-md processing-order-done-btn">
                    <span class="glyphicon glyphicon-ok"></span>
                </button>
            </div>
        </div>
    </div><!--end of processing-order-tamplates-->

    
    
        <div id="stall-management" >
            
            <ul class="nav nav-tabs">
              <li><a id="menu-info-btn">Menu Info</a></li>
              <li><a  id="stall-info-btn">Stall Info</a></li>
              <li><a id="report-btn">Report</a></li>
            </ul>
                        
    
            
            <div id="stall-info">
                <form id="stall-info-form">
                    <h3>Stall Info</h3>
                    <label for="stall-info-name">Name </label>
                    <input style="margin-bottom:15px" type="text" class="form-control"id="stall-info-name" />    
                   
                    <label for="stall-info-description">Description</label>
                    <textarea style="margin-bottom:15px" id="stall-info-description" class="form-control " rows="2" ng-model="result" ></textarea>    
                    
                    <button type="button" class="btn btn-info btn-md" id="stall-info-submit">
                            <span class="glyphicon glyphicon-ok-circle">Submit</span>
                    </button>  
                    <button type="button" class="btn btn-warning btn-md" id="stall-info-cancel">
                            <span class="glyphicon glyphicon-refresh">Cancel</span>
                    </button>    
                </form>
            </div>

        <div id="menu-info">
            <div id='menu-info-top'>
                <h3 id="menu-info-header" >Menu Info</h3>
                <div id="menu-info-add">
                    <button type="button" class="btn btn-info btn-md" id="menu-info-add-btn">
                        <span class="glyphicon glyphicon-plus"> Add Item</span>
                    </button> 
                </div>
            </div>
        </div>

        <div id="report">
        </div>
    
       <div style="display:none">

        <div id="menu-info-item-display-template" class="list-group-item menu-info-item-display" style="display:none">
            <div class="image-data"></div>
            
            
            <div class="menu-info-edit-btn">
                <div class="line1">
                    <span class="name-data"></span>
                    <span class="price-data"></span>
                    <span class="is_available_online-data">Online</span>
                </div>
                <div class="line2">
                    <span>Promotion: </span>
                    <span class="promotion-data"></span>
                    <span>Until: </span>
                    <span class="promotion_until-data"></span>
                </div>
                <div class="line3">
                    <span class="description-data"></span>
                </div>
            </div>
            <br class="clear-float"/>
        </div>
        <div id="menu-info-item-add-template" class="menu-info-item-add " style="display:none">
            <div class="image-data imgUploadPreview"></div>
            <form id="imgFormAdd" class="imgFormAdd imgForm" enctype="multipart/form-data" method="post">
                <input type=hidden name="itemid" id="itemid" class="itemid">
                <input type=hidden name="newimgid" id="newimgid" class="newimgid">
                <div class="hiddenfile" style="display:none">
                    <input type="file" name="fileToUpload" class="fileToUpload" id="fileToUpload"/>
                </div>
                <button type="button" class="btn btn-info btn-sm browse">
                    browse
                </button>
                <button type="button" class="btn btn-info btn-sm resetUploadBut">
                    Reset
                </button>
            </form>
            <div style="clear:both" ></div>
    
          
            <label class ="menu-edit-title" >Name</label>
            <input style="margin-right:10px"
            type="text"class="menu-info-add-name menu-edit-data form-control" />    
          
      
            <!--
            <label class ="menu-edit-title">Activated</label>
            <select class="menu-info-add-is_activated form-control menu-edit-data" style="margin-right:10px">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
            -->
          
            <label class ="menu-edit-title">Price</label>
            
            <input style="margin-right:10px" type="number" class="menu-info-add-price form-control menu-edit-data"/>
    
          
            <label class ="menu-edit-title">Promotion until</label>
            
            <input style="margin-right:10px" type="date" class="menu-info-add-promotion_until form-control menu-edit-data"/>
          
            <label class ="menu-edit-title">Available </label>
            <select class="menu-info-add-is_available form-control menu-edit-data">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
           
            <label class ="menu-edit-title">promotion</label>
            <input style="margin-right:10px" type="number" step="0.01" min="0" max="1" class="menu-info-add-promotion form-control menu-edit-data"/>

        
            <label class ="menu-edit-title">Available online</label>
            <select style="margin-right:10px"class="menu-info-add-is_available_online form-control menu-edit-data">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
        
            <label>Description</label>
            <textarea style="margin-bottom:5px" class="menu-info-add-description form-control" rows="2" ng-model="result" ></textarea>
           
            <button type="button" class="btn btn-info btn-md menu-info-add-submit-btn">
                    <span class="glyphicon glyphicon-ok"> Submit</span>
            </button>
            <button type="button" class="btn btn-info btn-md menu-info-add-cancel-btn">
                    <span class="glyphicon glyphicon-remove"> Cancel</span>
            </button>

        </div>
    
        <div id="menu-info-item-edit-template" class="menu-info-item-edit" style="display:none">
            <div class="image-data imgUploadPreview"></div>
            <form id="imgFormEdit" class="imgFormEdit imgForm" enctype="multipart/form-data" method="post">
                <input type=hidden name="itemid" id="itemid">
                <div class="hiddenfile" style="display:none">
                    <input type="file" name="fileToUpload" class="fileToUpload" id="fileToUpload"/>
                </div>
                <button type="button" class="btn btn-info btn-sm browse">
                     browse
                </button>
                <button type="button" class="btn btn-info btn-sm resetUploadBut">
                     Reset
                </button>
            </form>
            <div style="clear:both"></div>
    
          
            <label class ="menu-edit-title" >Name</label>
            <input style="margin-right:10px" type="text"class="menu-info-edit-name menu-edit-data form-control" />    
          
      
            <!--
            <label class ="menu-edit-title">Activated</label>
            <select class="menu-info-edit-is_activated form-control menu-edit-data" style="margin-right:10px">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
            -->


          
            <label class ="menu-edit-title">Price</label>
            
            <input style="margin-right:10px" type="number" class="menu-info-edit-price form-control menu-edit-data"/>
    
          
            <label class ="menu-edit-title">Promotion until</label>
            
            <input style="margin-right:10px" type="date" class="menu-info-edit-promotion_until form-control menu-edit-data"/>
          
            <label class ="menu-edit-title">Available </label>
            <select class="menu-info-edit-is_available form-control menu-edit-data">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
           
            <label class ="menu-edit-title">promotion</label>
            <input style="margin-right:10px" type="number" step="0.01" min="0" max="1" class="menu-info-edit-promotion form-control menu-edit-data"/>

        
            <label class ="menu-edit-title">Available online</label>
            <select style="margin-right:10px"class="menu-info-edit-is_available_online form-control menu-edit-data">
                <option value="1">yes</option>
                <option value="0">no</option>
            </select>
        
            <label>Description</label>
            <textarea style="margin-bottom:5px" class="menu-info-edit-description form-control" rows="2" ng-model="result" ></textarea>
           
            <button type="button" class="btn btn-info btn-md menu-info-edit-submit-btn">
                    <span class="glyphicon glyphicon-ok"> Submit</span>
            </button>
            <button type="button" class="btn btn-info btn-md menu-info-edit-cancel-btn">
                    <span class="glyphicon glyphicon-remove"> Cancel</span>
            </button>
            <button type="button" class="btn btn-warning btn-md menu-info-edit-deact-btn">
                    <span class="glyphicon glyphicon-trash"> Remove Item </span>
            </button>

        </div>
        <div id="report-template" class="report">
            <h3>Daily Report</h3>
            <table class="daily table">
            <thead>
                <tr>
                    <th>Item</th>
                    <th class="p1"></th>
                    <th class="p2"></th>
                    <th class="p3"></th>
                    <th class="p4"></th>
                    <th class="p5"></th>
                    <th class="p6"></th>
                    <th class="p7"></th>
                    <th class="p8"></th>
                    <th class="p9"></th>
                    <th class="p10 pthis"></th>
                    <th>Total</th>
                </tr>
            </thead>
            
            <tbody>
            </tbody>
            
            <tfoot>
                <tr class="num-orders">
                    <th>Number of orders</th>
                    <td class="p1"></td>
                    <td class="p2"></td>
                    <td class="p3"></td>
                    <td class="p4"></td>
                    <td class="p5"></td>
                    <td class="p6"></td>
                    <td class="p7"></td>
                    <td class="p8"></td>
                    <td class="p9"></td>
                    <td class="p10 pthis"></td>
                    <td class="total"></td>
                </tr>
                <tr class="revenue">
                    <th>Revenue</th>
                    <td class="p1"></td>
                    <td class="p2"></td>
                    <td class="p3"></td>
                    <td class="p4"></td>
                    <td class="p5"></td>
                    <td class="p6"></td>
                    <td class="p7"></td>
                    <td class="p8"></td>
                    <td class="p9"></td>
                    <td class="p10 pthis"></td>
                    <td class="total"></td>
                </tr>
            </tfoot>
            </table>

            <h3>Monthly Report</h3>
            <table class="monthly table">
            <thead>
                <tr>
                    <th>Item</th>
                    <th class="p1"></th>
                    <th class="p2"></th>
                    <th class="p3"></th>
                    <th class="p4"></th>
                    <th class="p5"></th>
                    <th class="p6"></th>
                    <th class="p7"></th>
                    <th class="p8"></th>
                    <th class="p9"></th>
                    <th class="p10"></th>
                    <th class="p11"></th>
                    <th class="p12 pthis"></th>
                    <th>Total</th>
                </tr>
            </thead>
            <tbody>
            </tbody>
            <tfoot>
                <tr class="num-orders">
                    <th>Number of orders</th>
                    <td class="p1"></td>
                    <td class="p2"></td>
                    <td class="p3"></td>
                    <td class="p4"></td>
                    <td class="p5"></td>
                    <td class="p6"></td>
                    <td class="p7"></td>
                    <td class="p8"></td>
                    <td class="p9"></td>
                    <td class="p10"></td>
                    <td class="p11"></td>
                    <td class="p12 pthis"></td>
                    <td class="total"></td>
                </tr>
                <tr class="revenue">
                    <th>Revenue</th>
                    <td class="p1"></td>
                    <td class="p2"></td>
                    <td class="p3"></td>
                    <td class="p4"></td>
                    <td class="p5"></td>
                    <td class="p6"></td>
                    <td class="p7"></td>
                    <td class="p8"></td>
                    <td class="p9"></td>
                    <td class="p10"></td>
                    <td class="p11"></td>
                    <td class="p12 pthis"></td>
                    <td class="total"></td>
                </tr>
            </tfoot>
            </table>
        </div>
        <table><tr class="one-row"><th></th></tr></table>
        <table><tr><td class="one-col"></td></tr></table>
    </div><!--end of stall-management-templates-->
    </div><!--end div of stall-management-->
    
    <nav class="navbar navbar-inverse navbar-fixed-top navbar" role="navigation">
      <!-- Brand and toggle get grouped for better mobile display -->
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
          <span class="sr-only">Toggle navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">CaMS Stall</a>
      </div>
    
      <!-- Collect the nav links, forms, and other content for toggling -->
      <div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav">
          <li><a id="take-order-btn">Taking Order</a></li>
          <li><a id="processing-order-btn">Processing Order</a></li>
         <li><a id="stall-management-btn">Stall management</a></li>
            
        </ul>
        <!--form class="navbar-form navbar-left" role="search">
            <div class="form-group">
                <input type="text" id="barcode" class="form-control"  placeholder="Barcode">
            </div>
        </form-->
      
    
        <ul class="nav navbar-nav navbar-right" name="userAdmin" id="userAdmin">
            
            <p class="navbar-text" >Welcome, <span id="user-display"></span> </p>
            <p class="navbar-text" > <a id='logout' href='#'style ="margin-right:15px">Logout</a></p>
    
        </ul>
      </div><!-- /.navbar-collapse -->
    </nav>

<div style="display:none"><!--templates applied to all-->
    <div id="black-out" class='black-out' tabindex='0'></div>
    <div id="alert" class="alert">
        <p class="message"></p>
        
        <button type="button" class="btn btn-info btn-sm alert-confirm" style="float:right;">
            <span class="glyphicon glyphicon-ok"> OK</span>
        </button>

    </div>
    <div id="confirm" class="confirm">
        <p class="confirm-message"></p>
        <div style="float:right">
            <button type="button" class="btn btn-info btn-sm confirm-confirm">
                <span class="glyphicon glyphicon-ok"> Yes</span>
            </button>
            
            <button type="button" class="btn btn-warning btn-sm confirm-cancel">
                <span class="glyphicon glyphicon-remove"> No</span>
            </button>
            
        </div>
    </div>
</div>
    

        
</div><!--end div of wrapper-->

</body>
</html>
